<html lang="zh-cn">
<meta charset="UTF-8">
<script src="https://jspreadsheet.com/v7/jspreadsheet.js"></script>
<link rel="stylesheet" href="https://jspreadsheet.com/v7/jspreadsheet.css" type="text/css"/>
<script src="https://jsuites.net/v4/jsuites.js"></script>
<link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css"/>

<body>
<div class="jq22-container">
    <h3>表28 稳定性结果表</h3>
    <div id="spreadsheet"></div>
    <div>
        <input type='button' value='新建' onclick="addrow(1)"/>
        <input type='button' value='保存' id="save" onclick="saveTable(1)"/></div>
</div>
</div>


<script>
    var data = [
        ['室外消火栓系统', '建筑类别1', 15, 20, 0.5, true, 36, false, '这里是选择依据'],
        ['室内消火栓系统', '建筑类别2', 10, 15, 0.5, false, 36, true, '填写选择依据'],
    ];

    table = jexcel(document.getElementById('spreadsheet'), {
        data: data,
        columns: [
            {type: 'text', title: '系统名称', width: '100'},
            {type: 'text', title: '建筑类别', width: '100'},
            {type: 'text', title: '最小设计流量(L/s)', width: '100'},
            {type: 'text', title: '设计流量(L/s)', width: '100'},
            {type: 'text', title: '灭火持续时间(h)', width: '100'},
            {type: 'checkbox', title: '是否计入一次灭火设计流量', width: '200'},
            {type: 'text', title: '用水量(m³)', width: '100'},
            {type: 'checkbox', title: '是否计入消防水池容积', width: '180'},
        ],
        nestedHeaders: [
            [
                {title: '', colspan: '1'},
                {title: '', colspan: '1'},
                {title: '', colspan: '1'},
                {title: '', colspan: '1'},
                {title: '', colspan: '1'},
                {title: '', colspan: '1'},
                {title: 'q(B)×t(B)×3600/1000', colspan: '1'},
                {title: '', colspan: '1'},
            ],
            [
                {title: '', colspan: '1'},
                {title: '', colspan: '1'},
                {title: '', colspan: '1'},
                {title: 'q(B)', colspan: '1'},
                {title: 't(B)', colspan: '1'},
                {title: '', colspan: '1'},
                {title: 'V(B)', colspan: '1'},
                {title: '', colspan: '1'},
            ],
        ],
        wordWrap: true,
        allowComments: true,
        contextMenu: function (obj, x, y, e) {
            var items = [];
            if (y == null) {
                // Sorting
                if (obj.options.columnSorting == true) {
                    // Line
                    items.push({type: 'line'});

                    items.push({
                        title: obj.options.text.orderAscending,
                        onclick: function () {
                            obj.orderBy(x, 0);
                        }
                    });
                    items.push({
                        title: obj.options.text.orderDescending,
                        onclick: function () {
                            obj.orderBy(x, 1);
                        }
                    });
                }
            } else {
                // Insert new row
                if (obj.options.allowInsertRow == true) {
                    items.push({
                        title: obj.options.text.insertANewRowAfter,
                        onclick: function () {
                            obj.insertRow(1, parseInt(y));
                        }
                    });
                }

                if (obj.options.allowDeleteRow == true) {
                    items.push({
                        title: obj.options.text.deleteSelectedRows,
                        onclick: function () {
                            obj.deleteRow(obj.getSelectedRows().length ? undefined : parseInt(y));
                        }
                    });
                }

                /*if (x) {
                    if (obj.options.allowComments == true) {
                        items.push({ type:'line' });

                        var title = obj.records[y][x].getAttribute('title') || '';

                        items.push({
                            title: title ? obj.options.text.editComments : obj.options.text.addComments,
                            onclick:function() {
                                obj.setComments([ x, y ], prompt(obj.options.text.comments, title));
                            }
                        });
                    }
                }*/
            }
            return items;
        },
        text: {
            insertANewRowAfter: "插入一行",
            deleteSelectedRows: "删除选中行"
        }
    });

    //提交保存
    function save() {
        table{{ table.id }}.formula = []
        txt = JSON.stringify(table{{ table.id }}.getDataAndFormula(false))
        txt1 = JSON.stringify(table{{ table.id }}.getHeaders())
        csrf = $("input[name='csrfmiddlewaretoken']").val()
        $.post("{% url 'excel' table.pid %}", {
            data: txt,
            header: txt1,
            {#csrfmiddlewaretoken: csrf#}
        }, function (result) {
            if (result.code == undefined) {
                window.location.href = '/login/'
            } else {
                alert('Error!');
            }
        })
    }



</script>

</body>
</html>